<!-- 轮播图组件 -->
<template>
    <van-swipe class="my-swipe" :autoplay="1000" indicator-color="white">
        <van-swipe-item v-for="item in swiperArr2" :key="item.id">
            <img :src="item.img" alt="">
        </van-swipe-item>
    </van-swipe>
</template>

<script lang="ts" setup>
// 引入 defineProps 函数
import { defineProps } from 'vue';
// 定义轮播图的数组类型
// type swiperArrItem = {
//     img: string,
//     alt: string,
//     [propName: string]: any
// }
// //  [propName: string]: any 剩余的参数规定一下类型
// // 规定接收的数组的数据类型
// const props = defineProps({
//     swiperArr: Array<swiperArrItem>
// });
// // 获取数组数据
// const swiperArr = props.swiperArr
type swiperar ={
    img:string,
    alt:string
    [propName:string]:any
}
const props = defineProps({
    swiperArr:Array<swiperar>
})
 const swiperArr2 = props.swiperArr  

</script>
<style lang="scss" scoped>
img {
    width: 100%;
    height: 350px;
}
</style>